<template>
  <div class="evaluate">
      <ul>
        <li class="list_review" v-for="(item,index) in list">
          <div class="list_review_img">
            <img v-bind:src="item.avatar">
          </div>
          <div class="list_review_time">{{item.addtime}}</div>
          <div class="list_review_main">
            <div class="list_review_name">{{item.nickname}}</div>
            <div class="list_review_star">
              评分&nbsp;
              <i v-bind:class="[item.score>0?'iconfont star icon-star':'iconfont star icon-star5']"></i>
              <i v-bind:class="[item.score>1?'iconfont star icon-star':'iconfont star icon-star5']"></i>
              <i v-bind:class="[item.score>2?'iconfont star icon-star':'iconfont star icon-star5']"></i>
              <i v-bind:class="[item.score>3?'iconfont star icon-star':'iconfont star icon-star5']"></i>
              <i v-bind:class="[item.score>4?'iconfont star icon-star':'iconfont star icon-star5']"></i>
            </div>
            <div class="list_review_cont">{{item.comment_detail}}</div>
          </div>
        </li>
      </ul>
    <!-- 更新经纬度 -->
    <lat-lng></lat-lng>
  </div>
</template>

<script>
import axios from 'axios'
import global from '../../../utils/global'
import store from '../../../utils/store'
export default {
  name: "evaluate",
  data () {
    return {
      list: [],
    }
  },
  mounted(){
    this.getInfo();
    this.$root.washShare();
  },
  methods: {
    // 获取信息
    getInfo(){
      var that = this;
      axios.get(global.api.order.worker.service,{
        params: {
          uuid: localStorage.getItem('carWashUuid'),
          page: '1',
          size: '1000',
        }
      })
      .then(function(res){
        console.log("getInfo then");
        console.log(res);
        that.list = res.data.data;
      })
      .catch(function(res){
        console.log("getInfo catch");
        console.log(res);
      }) 
    },
  },
}
</script>
  
<style scoped>
  .evaluate{}
  .evaluate ul{}
  /*客户点评*/
  .star{
    color: #2ecc80;
    font-size: 0.8rem;
  }
  .list_review{
    position: relative;
    padding: 1rem;
    border-bottom: 1px solid #B3B3B4;
  }
  .list_review_img{
    position: absolute;
    left: 1rem;
    top: 1rem;
  }
  .list_review_img img{
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
  }
  .list_review_time{
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 0.8rem;
    color: #888888;
  }
  .list_review_main{
    padding-left: 3rem;
    text-align: left;
  }
  .list_review_name{
    font-size: 0.9rem;
    margin-bottom: 0.2rem;
  }
  .list_review_star{
    font-size: 0.8rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    line-height: 1.7rem;
  }
  .list_review_cont{
    font-size: 0.8rem;
    line-height: 1.5rem;
    padding-right: 1rem;
  }
  
</style> 
<style>
  button:focus{
    outline-offset: 0px;
    outline: -webkit-focus-ring-color auto 0px;
  }
  ul,li,div,a,p,span{
    margin: 0;
    padding: 0;
  }
  li{
    list-style: none;
  }
  .flex{
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
  }
  .flex_1{
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
  }
</style>
